<div>
    <h1>Tabs</h1>
    <p>
        Material Design Extensions features styles and attached properties for styling a WPF <code>TabControl</code> to match the tabs styles in the
        <a href="https://material.io/design/components/tabs.html" target="_blank">Material Design specification</a>. The following predefined
        styles are available:
        <ul>
            <li><code>MaterialDesignTabControl</code></li>
            <li><code>MaterialDesignAppBarTabControl</code></li>
            <li><code>MaterialDesignAppBarAccentTabControl</code></li>
        </ul>
    </p>
    <h2>Screenshots</h2>
    <img src="https://raw.githubusercontent.com/spiegelp/MaterialDesignExtensions/master/screenshots/TabControl1.png" alt="Tabs" />
    <h2>Code example</h2>
    <p>
        Styling a <code>TabControl</code> in Material Design is as easy as applying a style to a control in XAML:
    </p>
    <pre class="language-markup"><code class="language-markup">&lt;TabControl Style="{StaticResource MaterialDesignTabControl}">
    &lt;TabItem Header="ANIMALS">&lt;/TabItem>
    &lt;TabItem Header="PLANTS">&lt;/TabItem>
    &lt;TabItem Header="VEHICLES">&lt;/TabItem>
&lt;/TabControl></code></pre>
    <script type="text/javascript">
        appViewModel.prepareCodeSnippets();
    </script>
</div>